/*
Theme Name: xmt
Theme URI: http://templates.silversite.pl/snaps/demo/
Description: Creative Template is based on the latest standarts for Bootstrap and Wordpress.
Author: piexl
Author URI: www.piexl.net
Version: 0.0.1
Text Domain: xmt
License: GNU General Public License version 3.0
License URI: http://amazeui.org/1.x/
*/

// 清除浏览器的默认样式开始
* { margin: 0; padding: 0; list-style: none; }
/* KISSY CSS Reset
理念：1. reset 的目的不是清除浏览器的默认样式，这仅是部分工作。清除和重置是紧密不可分的。
2. reset 的目的不是让默认样式在所有浏览器下一致，而是减少默认样式有可能带来的问题。
3. reset 期望提供一套普适通用的基础样式。但没有银弹，推荐根据具体需求，裁剪和修改后再使用。
特色：1. 适应中文；2. 基于最新主流浏览器。
维护：玉伯<lifesinger@gmail.com>, 正淳<ragecarrier@gmail.com> */
/** 清除内外边距 **/
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
pre, /* text formatting elements 文本格式元素 */
form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
th, td /* table elements 表格元素 */ { margin: 0; padding: 0; }
/** 设置默认字体 **/
body, button, input, select, textarea /* for ie */ { font: 12px/1.5 tahoma, arial, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
address, cite, dfn, em, var { font-style: normal; }
/* 将斜体扶正 */
code, kbd, pre, samp { font-family: courier new, courier, monospace; }
/* 统一等宽字体 */
small { font-size: 12px; }
/* 小于 12px 的中文很难阅读，让 small 正常化 */
/** 重置列表元素 **/
ul, ol { list-style: none; }
/** 重置文本格式元素 **/
a { text-decoration: none; }
a:hover { text-decoration: none; }
/** 重置表单元素 **/
legend { color: #000; }
/* for ie6 */
fieldset, img { border: 0; }
/* img 搭车：让链接里的 img 无边框 */
button, input, select, textarea { font-size: 100%; }
/* 使得表单元素在 ie 下能继承字体大小 */
/* 注：optgroup 无法扶正 */
/** 重置表格元素 **/
table { border-collapse: collapse; border-spacing: 0; }
// 清除浏览器的默认样式结束

.fl{float:left;}
.fr{float:right;}
.cl{clear:both;}


//文字的堆砌方式
.text-left{
	text-align:left;
}
.text-right{
	text-align:right;
}
.text-center{
	text-align:center;
}


//透明度
.opacity(@opacity) {
  opacity: @opacity;
  // IE8 filter
  @opacity-ie: (@opacity * 100);
  filter: ~"alpha(opacity=@{opacity-ie})";
}

//垂直居中对其的盒子
.center_v{
    /* Center vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

@color-orange:#E47000;
@color-red:rgba(134, 0, 0, 0.9);
@color-opacity:rgba(228, 112, 0, 0.85);

body{
  background-color:#e6e6e6;
  max-height:1680px;
  margin:0 auto;
  font:14px/1.5 "微软雅黑";
  color:#252525;
	overflow-x:hidden;
  a{
    color:darken(#971a2b,5%);
    &:hover{
      color:#971a2b;
    }
  }
  img{
    max-width:100%;
  }
}
.container{
  width:1000px;
  margin:0 auto;
}

#header{
  padding:20px 0 0 0;
  //height:123px;
  .top{margin-bottom:10px;}
  .left{
    padding:0 100px 0 30px;
    a{font-size:0; line-height:0;}
    background:url(assets/images/bgtext.png) no-repeat  right bottom;
  }
  .right{
    padding-top:46px;
    a{
      color:lighten(#000, 10%);
      &:hover{color:#000;};
      font-size:20px;
      padding-left:40px;
      padding-top:12px;
      line-height:20px;
      margin-right:1em;
    }
    .phone{background:url(assets/images/phone.png) no-repeat 0  0;}
    .qq{background:url(assets/images/qq.png) no-repeat 0  0;}
  }
  #nav{
    width:1000px;
    height:40px;
    background-color:#000;
    border-radius:5px;
    margin-bottom:0;
    margin-top:12px;
    a{
      display:block;
      padding:0 1.5em;
      height:40px;
      line-height:40px;
      font-size:18px;
      color:darken(#fff, 10%);
      &:hover{
        background-color:#f62929;
        color:#fff;
      }
    }
    li{
      height:40px;
      line-height:40px;
      &.firstnav{
        &.active a{
          border-top-left-radius:5px;
          border-bottom-left-radius:5px;
        }
        a:hover{
          border-top-left-radius:5px;
          border-bottom-left-radius:5px;
        }
      }
      &.lastnav{
        &.active a{
          border-top-right-radius:5px;
          border-bottom-right-radius:5px;
        }
        a:hover{
          border-top-right-radius:5px;
          border-bottom-right-radius:5px;
        }
      }
      &.active{
        a{
          background-color:#f62929;
          color:#fff;
        }
      }
    }
    &.fixed{
      position:fixed;
      top:0;
      left:50%;
      margin-left:-500px;
      z-index:1000;
    }
  }
}
.home #header{
  background:url(assets/images/dqgj_bg_01.jpg) no-repeat center  0;
}


// 主页样式
.home{
  .part{
    width:100%;
    background:url(assets/images/dqgj_bg_01.jpg) no-repeat center  0;
    &.part1{
      background-image:url(assets/images/dqgj_bg_02.jpg);
      height:781px;
      .content{
        width:375px;
        padding-top:182px;
        padding-left:32px;
        color:#fff;
        .title{
          margin-left:100px;
          margin-bottom:10px;
        }
        .text{
          width:220px;
          font-size:14px;
          color:darken(#fff, 10%);
          line-height:2em;
        }
      }
      .logos{
        padding-left:100px;
        a{
          line-height:0;
          font-size:0;
          margin:0 5px;
        }
      }
    }
    &.part2{
      background-image:url(assets/images/dqgj_bg_03.jpg);
      height:780px;
      .container{padding-top:183px;}
      .title{
        padding-left:555px;
        margin-bottom:26px;
      }
      .content{
        width:900px;
        margin:0 auto;
        .list{
          background:url(assets/images/home_13.png) no-repeat 0 0;
          padding:40px 0 40px 30px;
          height:226px;
        }
        li{
          margin-bottom:10px;
          a{
            color:darken(#fff, 10%);
            font-size:16px;
            &:before{
              content:'';
              width:0;
              height:0;
              line-height:0;
              font-size:0;
              border:10px solid #fff;
              position:relative;
              top:-7px;
              border-color:transparent transparent transparent darken(#fff, 10%);
            }
            &:hover{
              color:#fff;
              &:before{
                border-color:transparent transparent transparent #fff;
              }
            }
          }
        }
      }
    }
    &.part3{
      background-image:url(assets/images/dqgj_bg_04.jpg);
      height:845px;
      .container{padding-top:137px; padding-left:32px;}
      .title2{
        padding-left:154px;
      }
      .content{
        width:638px;
        padding-left:330px;
        height:600px;
        background:url(assets/images/datu_18.png?765f6fedd) no-repeat 0 0;
        padding:0 0 0 330px;
        .list{
          padding-left:200px;
          padding-top:20px;
          height:226px;
        }
        li{
          margin-bottom:20px;
          a{
            color:darken(#fff, 10%);
            font-size:20px;
            &:before{
              content:'';
              width:0;
              height:0;
              line-height:0;
              font-size:0;
              border:10px solid #fff;
              position:relative;
              top:-7px;
              border-color:transparent transparent transparent darken(#fff, 10%);
            }
            &:hover{
              color:#fff;
              &:before{
                border-color:transparent transparent transparent #fff;
              }
            }
          }
        }
      }
    } 
    &.part4{
      background-image:url(assets/images/dqgj_bg_05.jpg);
      height:897px;
      .container{padding-top:75px;}
      .title{margin-bottom:24px; text-align:center;}
      .list{
        background:url(assets/images/datu_27.png) no-repeat 0 0;
        height:549px;
        position:relative;
        padding-left:120px;
        li{
          //position:absolute;
          a{
            color:darken(#fff, 10%);
            font-size:20px;
            &:before{
              content:'';
              width:0;
              height:0;
              line-height:0;
              font-size:0;
              border:10px solid #fff;
              position:relative;
              top:-7px;
              border-color:transparent transparent transparent darken(#fff, 10%);
            }
            &:hover{
              color:#fff;
              &:before{
                border-color:transparent transparent transparent #fff;
              }
            }
          }
          // &.func_1{
          //   top:23px;
          //   left:196px;
          // }
          // &.func_2{
          //   top:36px;
          //   right:148px;
          // }
          // &.func_3{
          //   top:150px;
          //   left:70px;
          // }
          // &.func_4{
          //   top:233px;
          //   right:89px;
          //   a{
          //     color:lighten(#a91222, 10%);
          //     &.hover{color:#a91222;}
          //   }
          // }
          // &.func_5{
          //   right:275px;
          //   bottom:28px;
          // }
        }
      }
    } 
    &.part5{
      background-image:url(assets/images/dqgj_bg_06.jpg);
      height:684px;
      .container{padding-top:160px;}
      .content{
        width:713px;
        margin:0 auto;
      }
      .top{
        margin-bottom:40px;
        .tip{margin-top:10px; color:#ffef99; padding-left:20px;}
      }
      .bottom{
        .address{
          width:400px;
          background:url(assets/images/home_40.png) no-repeat 0 0;
          padding:56px 0 10px 68px;
          font-size:20px;
          color:#fff;
        }
        .contact{
          background:url(assets/images/home_42.png) no-repeat 0 0;
          margin-top:36px;
          padding:20px 0 10px 50px;
          font-size:20px;
          color:#fff;
          a{
            color:darken(#fff, 10%);
            &:hover{
              color:#fff;
            }
          }
        }
      }
    } 
  }
}



//详情页
.main{
  width:920px;
  margin:40px auto;
  background-color:#fff;
  padding:20px 40px;
  padding-bottom:60px;
  h3.title{
    font-size:22px;
    color:#000;
    border-bottom:1px solid #000;
    margin-bottom:1em;
  }
  p{
    font-size:14px;
    color:#252525;
    margin-bottom:1em;
  }
  img{
    max-width:100%;
  }
}

//底开始
#footer{
  width:100%;
  background-color:#000;
  color:#fff;
  padding:40px 0;
  .left_a{
    padding-top:20px;
  }
  p{
    text-align:left;
    color:darken(#fff, 10%);
  }
  .logo{margin-right:2em;}
  .qure{
    width:100px;
  }
  span{margin-right:2em;}
}

// 列表页
.items{
  width:100%;
  img{width:100%; height:auto;}
  .item{
    padding:20px 0;
    border-bottom:1px solid darken(#fff,20%);
    margin-bottom:20px;
    .w_320{
      width:320px;
      a{
        font-size:0;
        line-height:0;
      }
    }
    .w_600{
      width:580px;
      padding-left:20px;
      h3{
        font-size:20px;
        font-weight:bold;
        margin-bottom:10px;
        a{
          color:#000;
          &:hover{
            color:#f62929;
          }
        }
      }
      p{
        font-size:14px;
        color:#252525;
        line-height:2em;
      }
    }
  }
}


// 详情页中的翻页按钮
.pager{
  margin-top:20px;
  a{
    margin-right:1em; display:inline-block; padding:0.5em 1em; border-radius:0.3em; background-color:#252525; color:#fff;
    &:hover{
      color:#fff;
      background-color:darken(#f62929, 10%);
    }
  }
}


// 分页样式
/* -----------page nav-------*/  
.page_navi{width:100%;height:80px;line-height:36px;text-align:center;overflow:hidden;padding-top:1em;}  
.page_navi a{
  display: inline-block;
  color:darken(#fff,20%);
  height: 30px;
  line-height: 30px;
  padding:0 12px;
  border: 1px solid #a91222;
  margin: 0 2px;
  border-radius:3px;
  text-align:center;
  vertical-align: middle;
}
.page_navi a:hover{
  text-decoration: none;
  color:#fff;
  border: 1px solid lighten(#a91222,10%);
}
.page_navi a.current{
  display: inline-block;
  height: 30px;
  line-height: 30px;
  padding: 0 12px;
  margin: 0 2px;
  color: #fff;
  background-color:#a91222;
  border: 1px solid #a91222;
  border-radius:3px;
  vertical-align: middle;
} 



